<%@page import="java.util.Date" %>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="../include/tag.jsp" %>
<!DOCTYPE html>
<html lang="zh">
<head>
    <title>服务订购</title>
    <link rel="stylesheet" href="${ctx}/css/ui/about.css">
    <%@include file="../include/commonFile.jsp" %>

    <style>
        .hd-process {
            padding-top: 25px;
            font-size: 15px;
            text-align: center;
            letter-spacing: 2px;
        }

        .div-hy {
            background-color: rgba(242, 242, 242, 1);
            width: 1200px;
            height: 180px;
            margin: 0 auto
        }

        .offline-bm {
            background-color: rgba(242, 242, 242, 1);
            width: 600px;
            height: 180px;
            margin: 0 auto;
        }

        .offline-bm-d {
            padding-top: 15px;
            font-size: 15px;
        }

        .div-oo {
            width: 1200px;
            height: 80px;
            margin: 0 auto
        }


        .payment-alipay, .payment {
            display: inline-block;
            text-align: center;
            vertical-align: top;
        }

        .payment-alipay > img, #wechat-pay > img {
            height: 60px;
            margin: 30px 0;
        }

        .payBtn {
            cursor: pointer;
            display: block;
            width: 120px;
            height: 30px;
            border: 1px solid #3091f2;
            line-height: 30px;
            border-radius: 2px;
            margin: 20px auto 35px;
            color: #3091f2;
        }

        .payBtn:hover {
            background-color: #3091f2;
            color: #fff;
        }

        .payment-alipay > a {
            color: #fff;
            margin: 20px auto 0px;
            background-color: #3091f2;
        }

        /**版本**/
        .payment-v span {
            display: inline-block;
            vertical-align: top;
        }

        body {
            min-width: auto !important;
            background-color: white !important;
        }

        .payment-logo {
            margin-top: 21px;
        }

        .payment-logo > img {
            width: 40px;
            vertical-align: middle;
        }

        .payment-qcode {
            width: 190px;
            height: 190px;
            padding: 12px;
            background-color: #fff;
            border: 1px solid #E6E9EF;
            box-sizing: border-box;
            overflow: hidden;
        }

        .alipay-code {
            padding: 17px;
            border: 1px solid #E6E9EF;
            width: 154px;
            height: 154px;
        }

        [name=quantity] {
            height: 30px;
            line-height: 30px;
            width: 100px;
            margin-right: 5px;
        }

        .payment-hint {
            font-size: 20px;
            font-weight: 700;
            color: #333333;
            padding-top: 95px;
        }

        .payment-tip-icon {
            font-size: 85px;
            display: block;
            line-height: 1;
        }

        .remind-tip-icon {
            font-size: 20px;
        }

        .ctn-mn i {
            background: rgba(255, 255, 255, .7);
        }

        .sucbuy-btn {
            height: 100%;
            margin: 110px auto;
        }

        .sucbuy-btn a {
            width: 110px;
            height: 40px;
        }

        .selbuy-btn {
            overflow: hidden;
            margin: 50px auto;
        }

        .active .info {
            background: #e8473f;
            color: #fff;
        }

        .cost div:hover {
            font-size: 18px;
        }

        .info:hover {
            background: #e8473f;
            color: #fff
        }


        .tip-icon:hover .tips-info {
            display: block;
        }

        .tips-info {
            width: 250px;
            height: 90px;
            position: absolute;
            background: #fff;
            border-radius: 5px;
            display: none;
            cursor: pointer;
            right: 44px;
            top: -33px;
        }

        .tips-info p {
            padding: 10px 5px;
        }

        .tip-icon {
            display: inline-block;
            margin-right: 5px;
            position: relative;
        }

        .tip-icon b {
            display: inline-block;
            width: 20px;
            height: 20px;
            border: 2px solid #7d7b7b;
            line-height: 20px;
            border-radius: 20px;
            text-align: center;
            color: #7d7b7b;
            cursor: pointer;
        }

        .triangle {
            width: 0;
            height: 0;
            border-width: 10px 0 10px 10px;
            border-style: solid;
            border-color: transparent transparent transparent #ccc; /*透明 透明 透明 灰*/
            position: absolute;
            right: -10px;
            top: 35px;
        }

        .tips-box {
            line-height: 18px;
            text-align: left;
            padding-left: 12px;
            padding-top: 5px;
        }

        .tips-box span {
            font-size: 14px;
        }

        .space {
            width: 20px;
            height: 20px;
            position: absolute;
            right: -20px;
            top: 34px;
        }


    </style>
</head>
<body>
<!--头部-->
<%@include file="../include/header.jsp" %>
<div class="index-outside">
    <%@include file="../include/sidebar.jsp" %>
    <!--内容-->
    <section>
        <div class="section-main">
            <!--过程-->
            <div class="g-box ctn-mn wow fadeIn buy"
                 style="margin-bottom: 70px;width: 100%;border-bottom:1px solid; border-bottom-color:#d7d7d7;">
                <div class="m-ct-hd" style="padding-top: 20px;  height: 95px;">
                    <div class="hd-inner">
                        <h1 class="hd-process ">
                            <font ${packageMember ==null ? 'color="#e8473f"':''}>1.确认订购信息 </font>
                            <i></i>
                            <font ${packageMember !=null && packageMember.payStatus==1 && packageMember.payWay!=3 ? 'color="#e8473f"':''}>2.确认付款</font>
                            <i></i>
                            <font ${packageMember !=null &&(packageMember.payStatus==2 || packageMember.auditStatus == 1) ? 'color="#e8473f"':''}>3.完成订购</font>
                        </h1>
                    </div>
                </div>
            </div>
            <!--确认订购信息-->
            <div id="ddDiv" style="display:${packageMember ==null ? 'block':'none'} ">
                <div class="buy-bd g-box bg-white" style="margin-bottom: 70px;">
                    <div class="buy-btn" style="margin-bottom: 20px;">
                        <div>
                            <ul>
                                <li class="${type == null || type ==1 ? 'active':''} btn1" value="1">
                                    <div>社群系统</div>
                                </li>
                                <li class="${type != null && type ==2 ? 'active':''} btn2" value="2">
                                    <div>众筹系统</div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div style="width: 100%">
                        <ul class="cost">
                            <c:forEach var="productPackage" items="${productPackages}" varStatus="st">
                                <li style="width: 230px; padding-left:${productPackages.size() ==1? '275px':'0px'}; "
                                    class="">
                                    <div class="pSign f18 info" value="${productPackage.id}"
                                         price="${productPackage.price}" quantity="${productPackage.quantity}">
                                        <span class="iconfont icon-check icon"
                                              style="color:#fff;font-size: 34px; font-weight: 900;
                                                      visibility:hidden; position:relative;top: 2px; left:-30px;">
                                        </span>
                                        <span style="position: relative; left: -20px">￥${productPackage.price}/年</span>
                                    </div>
                                    <p>${productPackage.remarks}</p>
                                </li>
                            </c:forEach>
                        </ul>
                    </div>
                </div>


                <div class="div-hy">
                    <form id="hyForm" class="layui-form mt20" method="post"
                          action="${ctx}/serviceOrder/confirmOrder.do">
                        <input type="hidden" id="productId" name="productId" value="">
                    </form>
                    <div style="width: 800px;padding: 30px 0px 20px 50px;float: left">
                        <div class="text" style="margin-bottom: 10px; width: 300px">
                            <div class="text">
                                <input id="u38_input" type="checkbox" value="checkbox">
                                <span><label for="u38_input">我已阅读并同意</label></span>
                                <span><a href="${ctx}/serviceAgreement.do" style="color:#E94738" target="view_windows"> 《同行者服务协议》</a></span>
                            </div>
                        </div>
                        <div class="text">
                            <p><span>注：应相关部门要求，续费成功后，我们会有专职人员和您联系，需要您提供公司<br/>名称、营业执照信息，如未提供，我们有权限制您对系统的使用。</span></p>
                        </div>
                    </div>
                    <div style="float: left;width: 300px;margin-top: 15px;text-align:right;position: relative">
                        <div>
                            <div>
                                <p style="line-height:22px;">合计： ￥<span id="cal_total">0.00</span></p>
                            </div>
                            <div>
                                <p style="line-height:25px">服务周期：<span id="cal_cycle">0 年</span></p>
                            </div>

                            <div class="tip-icon">
                                <b>!</b>
                                <div class="tips-info">
                                    <div class="space"></div>
                                    <div class="tips-box">
                                        <div style="color: red"><span>原到期时间：</span><span
                                                id="y_endTime">0000-00-00 </span></div>
                                        <div style="color: red"><span>剩余：</span><span id="sy_day">0  </span>天</div>
                                        <div style="color: red"><span>剩余服务抵扣：</span><span id="sy_money">0.00  </span>元
                                        </div>
                                        <div style="color: red;margin-top: 5px"><span><a
                                                style="color: blue" href="javascript:upgradeExplain()">服务升级说明</a></span>
                                        </div>
                                        <div class="triangle"></div>
                                    </div>
                                </div>
                            </div>
                            <div style="display: inline-block"> 服务抵扣： ￥<span id="cal_deduction">0.00</span></div>

                            <div>
                                <p style="line-height:25px;color: #e8473f;font-size: 15px">应付款： ￥<span id="cal_payable">00.00</span>
                                </p>
                            </div>
                        </div>
                        <div style="margin-top: 15px">
                            <button class="layui-btn layui-btn-danger" lay-submit lay-filter="hyForm" id="paybut">
                                立即付款
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <!--确认付款-->
            <div id="orDiv"
                 style="display:${packageMember !=null && packageMember.payStatus==1 && packageMember.payWay!=3 ? 'block':'none'} ">
                <div class="div-oo">
                    <div class="text" style="width: 800px;float: left;padding-left: 40px;">
                        <p style="font-size: 14px">订单提交成功，请尽快付款！
                        <p/>
                        <p style="font-size: 14px; color: #949494;">请您在1天内完成支付，否则订单会被自动取消</p>
                    </div>
                    <div style="float: left;width: 200px;margin-top: 15px;padding-left:60px">
                        <input type="hidden" id="acl_packageMemberId" value="${packageMember.id}">
                        <p style="color: #e8473f;font-size: 16px" id="show_price" value="${packageMember.price}">
                            应付金额：￥${packageMember.price}</p>
                    </div>
                </div>
                <div class="selbuy-btn" style="margin-bottom: 50px;width: 480px">
                    <div style="text-align: center; margin: 0px auto;">
                        <div style="float: left;width: 100px">
                            <input type="radio" id="sel_online" name="payWay" lay-filter="payWay" value="0"
                                   checked="checked">
                            <label for="sel_online"><span style="margin-left: 10px">在线支付</span></label>
                        </div>
                        <div style="float: left;width: 250px;height: 20px"></div>
                        <div style="float: left;width: 100px">
                            <input type="radio" id="sel_offline" name="payWay" lay-filter="payWay" value="1">
                            <label for="sel_offline"><span style="margin-left: 10px">线下转账</span></label>
                        </div>
                    </div>
                </div>

                <div style="margin: 50px 0px 150px 0px;">
                    <!--线上支付-->
                    <div id="online" class="payment-t select-payment"
                         style="margin: 50px auto;width: 750px;display: block ">
                        <%-- <div class="payment-v">选择支付平台</div>--%>
                        <div class="third-payment" style="text-align:center;display: flex; padding-top: 30px">
                            <div style="flex: 1">
                                <div class="payment-alipay">
                                    <img src="${ctx}/image/pay/alipay.png"/>
                                    <div id="alipay-btn" class="payBtn">点击去支付</div>
                                </div>
                                <div id="ali-pay-qrcode" class="payment" style="display:none;">
                                    <iframe id="payFrame" scrolling="no" frameborder="0" class="alipay-code"></iframe>
                                    <div class="payment-logo">
                                        <img src="${ctx}/image/pay/alipay.png"/>
                                        支付宝扫码支付
                                    </div>
                                </div>
                            </div>
                            <div style="flex: 1">
                                <div id="wechat-pay" class="payment">
                                    <img src="${ctx}/image/pay/wechatpay.jpg"/>
                                    <div id="wechat-btn" class="payBtn">点击去支付</div>
                                </div>
                                <div id="wechar-pay-qrcode" class="payment" style="display:none;">
                                    <img id="wechat-pay-qrcode-img" class="payment-qcode"/>
                                    <div class="payment-logo">
                                        <img src="${ctx}/image/pay/wechatpay.jpg"/>
                                        微信扫码支付
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--线下支付-->
                    <div id="offline" style="display: none;">
                        <div class="offline-bm" style="text-align: center;">
                            <div style="padding-top: 20px">
                                <p style="font-size: 16px;">您需要转账 <span
                                        style="color: red;font-size: 18px">${packageMember.price}元</span>
                                    至以下账户，转账成功后填写相应的信息并且提交审核</p>
                            </div>
                            <div>
                                <div class="offline-bm-d">
                                    <span>收款户名：</span>
                                    <span><b>深圳前海同行者咨询有限公司</b></span>
                                </div>
                                <div class="offline-bm-d">
                                    <span>收款银行：</span>
                                    <span><b>工商银行深圳高新园中区支行</b></span>
                                </div>
                                <div class="offline-bm-d">
                                    <span>银行账号：</span>
                                    <span><b>4000093309100187771</b>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                                </div>
                            </div>
                        </div>
                        <div style="text-align: center;margin: 25px 0px 30px 0px;font-size: 18px">
                            <b>对公转账</b>
                        </div>
                        <div style="text-align: center;margin: 25px 0px 30px 0px;">
                            <a class="layui-btn layui-btn-danger"
                               href="#" id="subRVoucherId">已转账汇款，提交汇款凭证</a>
                        </div>
                    </div>
                </div>

            </div>
            <!--完成订购-->
            <div id="suDiv"
                 style="display:${packageMember !=null && (packageMember.payStatus >=2 || packageMember.payWay==3) ? 'block':'none'} ">
                <div class="ctn-mn wow fadeIn">
                    <div class="hd-inner">
                        <c:if test="${packageMember.auditStatus ==1}">
                            <div><i class="iconfont icon-roundcheck payment-tip-icon" style="color: #5acc6f"></i>
                                <p class="payment-hint">提交成功</p></div>
                            <div style="margin: 15px auto;text-align: center">
                                <p>
                                    您的转账汇款凭证提交成功！
                                </p>
                                <p>
                                    确认收款后您订购的服务会在1个工作日开通
                                </p>
                            </div>
                        </c:if>
                        <c:if test="${packageMember.payStatus ==2}">
                            <div><i class="iconfont icon-roundcheck payment-tip-icon" style="color: #5acc6f"></i>
                                <p class="payment-hint">付款成功</p></div>
                        </c:if>
                        <c:if test="${packageMember.payStatus >2}">
                            <div><i class="iconfont icon-info payment-tip-icon" style="color: #e8473f"></i>
                                <p class="payment-hint">付款失败</p></div>
                            <div style="margin: 15px auto">
                                <p>
                                    未完成服务订购，请查看订单并重新支付
                                </p>
                            </div>
                        </c:if>
                    </div>
                    <div class="sucbuy-btn">
                        <div style="text-align: center;">
                            <a class="layui-btn layui-btn-danger" href="${ctx}/serviceOrder/list.do">查看订单</a>
                            <c:if test="${packageMember.payStatus ==2 ||packageMember.auditStatus == 1}">
                                <a class="layui-btn layui-btn-normal"
                                   href="${ctx}/system/member/memberIndex.do">返回首页</a>
                            </c:if>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--底部-->
        <%@include file="../include/footer.jsp" %>
    </section>
    <div id="rVid" style="display: none;">
        <form class="layui-form p20" id="rVfrom" method="post" action="">
            <div class="layui-form-item" style="text-align: center;margin-bottom: 20px">
                <p>付款方信息</p>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 70px">开户名<span class="f-verify-red">*</span></label>
                <div class="layui-input-inline">
                    <input class="layui-input" maxlength="30" name="accountName" value='' style="width:280px;"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 70px">开户行<span class="f-verify-red">*</span></label>
                <div class="layui-input-inline">
                    <input class="layui-input" maxlength="50" name="openingBank"
                           placeholder="如：工商银行深圳高新园中区支行" value='' style="width:280px;"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 70px">银行账号<span class="f-verify-red">*</span></label>
                <div class="layui-input-inline">
                    <input class="layui-input" maxlength="30" name="bankAccount" value='' style="width:280px;"/>
                </div>
            </div>
            <div class="layui-form-item" style="padding-left: 10px">
                <label class="layui-form-label" style="width: 75px">应付金额：</label>
                <span class="layui-input-inline" id="alt_price" style="font-size: 17px; padding-top: 6px;">
                </span>
            </div>
            <input type="hidden" name="packageMemberId" value="">
        </form>
    </div>
    <div id="upgradeExplainDiv" style="font-weight:bold;width: 480px;margin: 20px 0px 20px 25px">
     <span style="display:block; font-size: 1px">
       <div>
         <p>服务升级说明</p>
         <p>1、在套餐升级时，按照时间计算原订单剩余服务期的价值进行抵扣；</p>
         <p>2、订购24小时内进行抵扣升级，则在升级套餐内可以使用原订单全部金额进行抵扣；</p>
         <p>3、订购24小时后进行抵扣升级，则仅可以使用实际支付的金额的剩余服务期进行抵扣；</p>
         <p>4、服务升级后，不支持在线降级，需要到期后购买或联系客服；</p>
      </div>
       <div style="margin-top: 10px;">
        <p>计算公式：</p>
        <p>抵扣金额 = 剩余服务期金额</p>
        <p>剩余服务期金额=购买1年套餐的金额/365天*（365天-升级操作时已经使用的服务天数）</p>
       </div>
    </span>
    </div>
</div>


<script type="text/javascript" src="${ctx}/script/common/list.js"></script>
<script type="text/javascript" src="${ctx}/script/common/table_option.js"></script>
<script type="text/javascript">
    txz.initHeader({
        nav: [{
            name: '服务订购'
        }, {
            name: '订购详情',
            curr: true
        }]
    });

    var checkTimeOut = null;
    var orderId = null;
    var packageMemberId = null;
    $(function () {
        var form, laydate, element;
        layui.use(['form', 'laydate', 'element'], function () {
            form = layui.form, laydate = layui.laydate, element = layui.element;

            //tab切换
            $('.buy-btn li').click(function () {
                var type = $(this).attr('value');
                window.location.href = "${ctx}" + "/serviceOrder/info.do?type=" + type

            })
            //点击产品列表
            $('.pSign').click(function () {
                var productId = $(this).attr('value');
                var price = $(this).attr('price');
                var quantity = $(this).attr('quantity');
                $.post("${ctx}/serviceOrder/calculateAmount.do", {productId: productId}, function (res) {
                    if (res.success) {
                        $("#productId").attr('value', productId);

                        var price_v1 =price
                        var quantity_v1 =quantity +" 年";

                        if (res.data == null) {
                            $("#cal_payable").text(price);
                        } else {
                            var deductionAmount = res.data.deductionAmount;

                            if(deductionAmount>0){
                                price_v1 = res.data.goodsPrice;
                                quantity_v1 = res.data.originalResidueDay +" 天";
                            }
                            $("#cal_deduction").text(deductionAmount);
                            $("#cal_payable").text(res.data.price);
                            $("#y_endTime").text(res.data.originalEndTime);
                            $("#sy_day").text(res.data.originalResidueDay);
                            $("#sy_money").text(res.data.deductionAmount);
                        }
                        $("#cal_total").text(price_v1);
                        $("#cal_cycle").text(quantity_v1);
                    } else {
                        $("#paybut").attr("disabled", 'ture');
                        $("#paybut").attr("style.backgroundColor", '#555555');
                        util.layerMsgError(res.description);
                    }
                })
            })

            form.on('submit(hyForm)', function (data) {
                var productId = $("#productId").val();

                if (productId == '') {
                    util.layerMsgError("请您勾选需要购买系统的套餐")
                    return false;
                }
                if (!$("#u38_input").is(':checked')) {
                    util.layerMsgError("请您阅读并同意《同行者服务协议》方可付款")
                    return false;
                }
                txz.submitObject(data.elem, function (callBack) {
                    $.ajax({
                        url: '${ctx}/serviceOrder/isUnpaidOrder.do',
                        type: 'POST',
                        async: false, // 使用同步的方法
                        dataType: 'json',
                        success: function (res) {

                            if (res.success) {
                                if (res.data) {
                                    util.layerAlertError("已存在待支付(审核中)的订单，请完成支付(审核通过)或取消订单后再来购买", function () {
                                        window.location.href = "${ctx}" + "/serviceOrder/list.do"
                                    })
                                    return false;
                                } else {

                                    var action = $("#hyForm").attr("action");
                                    $.post(action, $('#hyForm').serialize(), function (res) {
                                        typeof callBack === 'function' && callBack();
                                        if (res.success) {
                                            util.layerMsgSuccess(res.description, function () {
                                                window.location.href = "${ctx}" + "/serviceOrder/info.do?packageMemberId=" + res.data;
                                            });
                                        } else {
                                            util.layerMsgError(res.description)
                                        }
                                    });


                                }
                            } else {
                                util.layerMsgError('确定订单异常');
                                return false;
                            }
                        }
                    });
                })
                return false;
            });

            $('input:radio[name="payWay"]').change(function () {
                var selpayWay = $(this).attr('value');
                if (selpayWay == 0) {
                    $("#online").show();
                    $("#offline").hide();
                } else if (selpayWay == 1) {
                    $("#online").hide();
                    $("#offline").show();
                }
            });

            $("#alipay-btn").click(function () {
                //loading层
                var loadIndex = layer.load(1, {
                    shade: [0.1, '#fff'] //0.1透明度的白色背景
                });

                var result = syncInsertOrder('0', '${packageMember.id}', loadIndex);
                if (result) {
                    $("#payFrame").attr('src', '${ctx}/pay/ali/pc/' + orderId + '/buyOrder.do');
                    $(this).parent().hide().siblings('div').show();
                    $("#wechat-btn").parent().show().siblings('div').hide();
                    checkOrder(orderId);
                } else {
                    layer.close(loadIndex);
                }
            });

            $("#wechat-btn").click(function () {
                //loading层
                var loadIndex = layer.load(1, {
                    shade: [0.1, '#fff'] //0.1透明度的白色背景
                });

                var result = syncInsertOrder('1', '${packageMember.id}', loadIndex);
                if (result) {
                    $("#wechat-pay-qrcode-img").attr('src', '${ctx}/pay/wechat/pc/' + orderId + '/getQrCodeImg.do');
                    $(this).parent().hide().siblings('div').show();
                    $("#alipay-btn").parent().show().siblings('div').hide();
                    $("#payFrame").attr('src', '');

                    checkOrder(orderId);
                } else {
                    layer.close(loadIndex);
                }
            });
            $('.cost li').click(function () {
                $(this).addClass('active').siblings('li').removeClass('active')
                $(this).find('.icon').css('visibility', 'visible')
                $(this).siblings('li').find('.icon').css('visibility', 'hidden')
            });

            function syncInsertOrder(payWay, packageMemberId, loadIndex) {
                var flag = true;
                $.ajax({
                    type: 'POST',
                    async: false, // 使用同步的方法
                    data: {
                        paymentWay: payWay,
                        packageMemberId: packageMemberId
                    },
                    dataType: 'json',
                    success: function (res) {
                        layer.close(loadIndex);
                        if (res.success) {
                            orderId = res.data;
                        } else {
                            flag = false;
                            util.layerMsgError("加载支付二维码异常");
                        }
                    },
                    url: '${ctx}/charge/package/systemBuy/insertOrder.do'
                });
                return flag;
            };

            function checkOrder(orderId) {
                if (checkTimeOut != undefined) {
                    clearInterval(checkTimeOut);
                }
                checkTimeOut = setInterval(function () {
                    $.post("${ctx}/pay/ali/pc/checkOrderStatus.do", {orderId: orderId}, function (res) {
                        if (res.success) {
                            if (res.data.status == 2) {
                                clearInterval(checkTimeOut);
                                window.location.href = "${ctx}" + "/serviceOrder/info.do?packageMemberId=" + '${packageMember.id}';
                            }
                        } else {
                            util.layerMsgError('支付异常，请保存好支付记录联系我们的客服');
                        }
                    })
                }, 5000);
            }


            $('#subRVoucherId').click(function () {

                var aclPrice = $("#show_price").attr('value');
                var packageMemberId = $("#acl_packageMemberId").attr('value');
                var index = layer.open({
                    type: 1,
                    area: ['450px', '430px'],
                    title: '提交汇款凭证',
                    content: $("#rVid"),
                    btn: ['提交', '取消'],
                    success: function () {
                        $("#alt_price").text(aclPrice);
                        $("#rVid [name=packageMemberId]").attr('value', packageMemberId);
                    },
                    end: function () {
                        $("#alt_price").text("");
                        $("#rVid [name=packageMemberId]").attr('value', "");
                    },
                    yes: function () {
                        var msg = "";
                        var bankAccount_val = $("#rVid [name=bankAccount]").val();
                        if (bankAccount_val == "") {
                            msg = "银行账号不能为空";
                        }
                        var openingBank_val = $("#rVid [name=openingBank]").val();
                        if (openingBank_val == "") {
                            msg = "开户行不能为空";
                        }
                        var accountName_val = $("#rVid [name=accountName]").val();
                        if (accountName_val == "") {
                            msg = "开户名不能为空";
                        }
                        if (msg != "") {
                            util.layerMsgError(msg);
                            return null;
                        }
                        var index = layer.load(1);
                        $.post("${ctx}/serviceOrder/submitVoucher.do.do", $("#rVid form").serializeArray(), function (ret) {
                            layer.close(index);
                            if (ret.success == true) {
                                util.layerMsgSuccess(ret.description, function () {
                                    window.location.href = "${ctx}" + "/serviceOrder/info.do?packageMemberId=" + packageMemberId;
                                });
                            } else {
                                util.layerMsgError(ret.description);
                            }
                        });
                    }
                });
            })


        });
    })

    function upgradeExplain() {

        var setPayIndex = layer.open({
            type: 1,
            area: '530px',
            title: '服务升级说明',
            content: $("#upgradeExplainDiv"),
            btn: ['关闭'],
            success: function () { // 弹出后回调

            },
            yes: function () { // 确定按钮
                layer.close(setPayIndex);
            },
            end: function () {//取消按钮
                layer.close(setPayIndex);
            }
        });
    }
</script>
</body>
</html>